<template>
  <Table ref="table" :columns="columns" :data="curProperty[category]">
    <template slot-scope="{ row, index }" slot="type">
      <fieldCell
        v-model="curProperty[category][index].type"
        :config="{ editor: 'display'}"
      ></fieldCell>
    </template>
    <template slot-scope="{ row, index }" slot="name">
      <fieldCell
          v-model="curProperty[category][index].name"
          :config="{ editor: 'display'}"
      ></fieldCell>
    </template>
    <template slot-scope="{ row, index }" slot="value">
      <fieldCell
          v-model="curProperty[category][index].value"
          :config="{ editor: 'text'}"
          @change="syncGroup"
      ></fieldCell>
    </template>
    <template slot-scope="{ row, index }" slot="US">
      <fieldCell
          v-model="curProperty[category][index]['en-US']"
          :config="{ editor: 'text'}"
          @change="syncGroup"
      ></fieldCell>
    </template>
    <template slot-scope="{ row, index }" slot="CN">
      <fieldCell
          v-model="curProperty[category][index]['zh-CN']"
          :config="{ editor: 'text'}"
          @change="syncGroup"
      ></fieldCell>
    </template>
  </Table>
</template>

<script>
    import fieldCell from './fieldCell'
    import storeVar from '../../mixins/storeVar';
    export default {
      name:'internationalList',
      components: { fieldCell },
      mixins:[storeVar],
      props: {
        category: {
              default: () => {
                  return 'international';
              }
          },
      },
      data () {
          return {
              columns: [
                {
                  key: 'type',
                  title: this.$t(`compDesign.jProperty.type`),
                  maxWidth: 80,
                  align: 'center'
                },
                {
                    key: 'name',
                    title: this.$t(`compDesign.jProperty.attrName`),
                    maxWidth: 150,
                    align: 'center'
                },
                {
                    key: 'value',
                    title: this.$t(`compDesign.jProperty.defaultValue`),
                    minWidth: 100,
                    align: 'center',
                    slot: 'value'
                },
                {
                    key: 'en-US',
                    title: this.$t(`compDesign.jProperty.english`),
                    minWidth: 100,
                    align: 'center',
                    slot: 'US'
                },
                {
                  key: 'zh-CN',
                  title: this.$t(`compDesign.jProperty.chinese`),
                  minWidth: 100,
                  align: 'center',
                  slot: 'CN'
                }
              ]
          };
      },
      mounted () {},
      methods:{

      }

    };
</script>
<style scoped lang="scss"></style>
